
<template>
  <h1>文本指令</h1>
<!--  //插值指令，将显示文本与响应式变量进行绑定，并不断监听它的变化进行显示-->
  <p>{{ref1}}</p>
  <p v-text="ref1"></p>
<!-- v-heml 内有标签则会嗯句变迁 -->
  <p v-html="ref1"></p>
  <button @click="f" >change</button>



</template>

<script setup>
//导入ref函数
import {ref} from "vue";
//通过ref函数定义响应变量，并设置value的值
const ref1 = ref("yuanshenqindong");
//给点击事件绑定方法来更改ref1的value值
const f =()=>{
  console.log(ref1);
  ref1.value="原神，<b>启动</b>";
}


</script>
<style scoped>

</style>